 .container {
   position: relative;
   height: 250px;
   color: #fff;
   overflow: hidden;



 }

 .info-wrapper {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   display: flex;
   align-items: center;
   padding: 30px 20px 0;

   overflow: hidden;
   background: rgba(0, 0, 0, .3);



 }

 .left {
   position: relative;
   width: 125px;
   height: 125px;

 }

 .left img {
   width: 125px;
   height: 125px;
 }

 .left p {
   position: absolute;
   right: 5px;
   top: 5px;
   font-size: 12px;
   font-weight: 700;
 }

 .right {
   flex-grow: 1;
   margin-left: 10px;
   font-weight: bold;



 }

 .name {
   width: 100%;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   max-height: 47px;
   line-height: 1.3;
   overflow: hidden;
   font-size: 18px;
 }

 .bg-img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   -webkit-filter: blur(36px);
   filter: blur(36px);
   transform: scale(1.1);
 }

 .author {
   display: flex;
   align-items: center;
   margin: 8px 0;


 }

 .author img {
   width: 24px;
   height: 24px;
   margin-right: 8px;
   border-radius: 24px;
 }

 .author span {
   flex-grow: 1;
   width: 100px;

 }